import { defineStore } from "pinia";
import { ref } from "vue";
import { TAGS_VIEW } from "@/enums/cacheEnums";
import { getItem, setItem, removeItem } from "@/utils/storage";

import { PageEnum } from '@/enums/pageEnum'

export const getRouteParams = (tabItem) => {
  const { params, path, query } = tabItem;
  return {
    params: params || {},
    path,
    query: query || {},
  };
};
 

const findTabsIndex = (fullPath, tabList) => {
  return tabList.findIndex((item) => item.fullPath === fullPath)
}

export const useTabsStore = defineStore("tabs", () => { 
  const tagsViewList = ref(getItem(TAGS_VIEW) || []);
  const cacheTabList = ref(new Set());
  const tasMap = ref(getItem('tasMap') || {})
  const indexRouteName = ref('')
 
  const initTagsViewList = (state) => {
    tagsViewList.value = [];
    removeItem(TAGS_VIEW);
  }

 const setRouteName = (name) => {
    indexRouteName.value = name
  }
 
  const addTagsViewList = (tag) =>  {   
    const {fullPath,name,path,meta,query,params} = tag
    const isFind = tagsViewList.value.find((item) => {
      return item.path === tag.path;
    }); 
    const tabItem = {
      name,
      path,
      fullPath,
      title: meta?.title,
      query,
      params
    }
    tasMap.value[fullPath] = tabItem 
    setItem('tasMap', tasMap.value); 
    // 处理重复
    if (!isFind) { 
      tagsViewList.value.push(tag);
      setItem(TAGS_VIEW, tagsViewList.value);
    }
    const componentName = getComponentName(tag);
    if (tag.meta?.keepAlive) {
      addCache(componentName);
    }  
  }

  const getComponentName = (route) =>  { 
    return route.matched.at(-1)?.components?.default?.name;
  }

  const addCache = (componentName)  => {
    if (componentName) cacheTabList.value.add(componentName);
  }

  const removeCache = (componentName) =>  {
    if (componentName && cacheTabList.value.has(componentName)) {
      cacheTabList.value.delete(componentName);
    } 
  } 

  const changeTagsView = ({ index, tag }) => {
    tagsViewList.value[index] = tag;
    setItem(TAGS_VIEW, tagsViewList.value);
  }


  const removeTagsView = (fullPath,router) => { 
        const { currentRoute, push } = router
        const index = findTabsIndex(fullPath, tagsViewList.value)
        // 移除tab
        if (tagsViewList.value.length > 1) {
            index !== -1 && tagsViewList.value.splice(index, 1)
        }
        const componentName = getComponentName(currentRoute.value)
        removeCache(componentName)
        if (fullPath !== currentRoute.value.fullPath) {
            return
        }
        // 删除选中的tab
        let toTab  = null

        if (index === 0) {
            toTab = tagsViewList.value[index]
        } else {
            toTab = tagsViewList.value[index - 1]
        }

        const toRoute = getRouteParams(toTab)
        setItem(TAGS_VIEW, tagsViewList.value);
        push(toRoute) 
  }

const removeOtherTab = (route) => {
    tagsViewList.value = tagsViewList.value.filter((item) => item.fullPath == route.fullPath)
    const componentName = getComponentName(route)
     cacheTabList.value.forEach((name) => {
        if (componentName !== name) {
            removeCache(name)
        }
    })
}

 const removeAllTab = (router) => { 
    const { push, currentRoute } = router
    const { name } = unref(currentRoute)
    if (name == indexRouteName.value) {
        removeOtherTab(currentRoute.value)
        return
    }
    tagsViewList.value = [];
    removeItem(TAGS_VIEW);
    push(PageEnum.INDEX)
}

  return {
    tagsViewList,
    cacheTabList,
    initTagsViewList,
    addTagsViewList,
    changeTagsView,
    removeTagsView,
    tasMap,
    removeAllTab,
    setRouteName,
    removeOtherTab
  };
});
